<script setup lang="ts">
defineProps({
  size: Number,
  total: Number,
  currentPage: Number
})

const emit = defineEmits(['current-page-change'])

// 当前页码发生改变
const handleCurrentPageChange = (newPage: number) => {
  emit('current-page-change', newPage)
}
</script>

<template>
  <div class="pager-box center">
    <el-pagination background layout="prev, pager, next"
                   :page-size="size"
                   :total="total"
                   :current-page="currentPage"
                   @current-change="handleCurrentPageChange"
    />
  </div>
</template>

<style scoped lang="scss">
.pager-box {
  height: 100px;
}
</style>